<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:c="http://java.sun.com/jsp/jstl/core">

<script type="text/javascript">
	function exibe(id) {
		if (document.getElementById(id).style.display == "none") {
			document.getElementById(id).style.display = "inline";
		} else {
			document.getElementById(id).style.display = "none";
		}
	}
</script>

<body>
	<f:view>
		<ui:include src="/header.xhtml" />
	</f:view>
	<div class="container_12">
		<br />
		<h:form id="reserva">
			<div class="voo" id="divVoo">
				<div class="grid_3">
					<div class="box">
						<h5>Tipo de passagem</h5>
						<h:selectOneRadio value="#{reservaBusiness.reserva.tipo}"
							styleClass="tipoPassagem">
							<f:selectItem itemValue="ida" itemLabel="só ida" />
							<f:selectItem itemValue="idaevolta" itemLabel="ida e volta" />
						</h:selectOneRadio>

						<h:selectOneMenu style="margin-top:-5px;"
							value="#{reservaBusiness.reserva.numPassageiros}">
							<f:selectItem itemValue="1" itemLabel="1 Passageiro" />
							<f:selectItem itemValue="2" itemLabel="2 Passageiros" />
							<f:selectItem itemValue="3" itemLabel="3 Passageiros" />
							<f:selectItem itemValue="4" itemLabel="4 Passageiros" />
							<f:selectItem itemValue="5" itemLabel="5 Passageiros" />
						</h:selectOneMenu>
					</div>
				</div>
				<div class="grid_3" id="gridOrigem">
					<div class="box" id="boxOrigem">
						<h5>Origem</h5>
						<h:selectOneMenu id="cidadeOrigem"
							value="#{reservaBusiness.reserva.codAerpIda}">
							<f:selectItem itemValue=""
								itemLabel="Selecionar cidade de origem" />
							<f:selectItems id="listaOrigem"
								value="#{reservaBusiness.cidades}" />
							<f:ajax event="change" render="reserva:destino"
								execute="#{reservaBusiness.destinobyOrigem}" />
						</h:selectOneMenu>
					</div>
				</div>
				<div class="grid_3" id="gridDestino">
					<div class="box" id="boxDestino">
						<h5>Destino</h5>
						<h:selectOneMenu id="destino"
							value="#{reservaBusiness.reserva.codAerpVolta}">
							<f:selectItem itemValue=""
								itemLabel="Selecionar cidade de destino" />
							<f:selectItems id="listaDestinos"
								value="#{reservaBusiness.destinobyOrigem}" />
							<f:ajax render="voos" execute="@all" />
						</h:selectOneMenu>
					</div>
				</div>
				<div class="grid_3">
					<div class="box cobranca">
						<h5>Forma de pagamento</h5>
						<h:selectOneRadio value="#{reservaBusiness.reserva.formaPagamento}"
							styleClass="tipoPassagem">
							<f:selectItem itemValue="avista" itemLabel="à vista" />
							<f:selectItem itemValue="aprazo" itemLabel="a prazo" />
						</h:selectOneRadio>
						
						<br/>
						<h:selectOneMenu style="margin-top:-25px;"
							value="#{reservaBusiness.reserva.numParcelas}">
							<f:selectItem itemValue="" itemLabel="parcelas" />
							<f:selectItem itemValue="1" itemLabel="1 parcela" />
							<f:selectItem itemValue="2" itemLabel="2 parcelas" />
							<f:selectItem itemValue="3" itemLabel="3 parcelas" />
							<f:selectItem itemValue="4" itemLabel="4 parcelas" />
							<f:selectItem itemValue="5" itemLabel="5 parcelas" />
							<f:selectItem itemValue="6" itemLabel="6 parcelas" />
							<f:selectItem itemValue="7" itemLabel="7 parcelas" />
							<f:selectItem itemValue="8" itemLabel="8 parcelas" />
							<f:selectItem itemValue="9" itemLabel="9 parcelas" />
							<f:selectItem itemValue="10" itemLabel="10 parcelas" />
							<f:selectItem itemValue="11" itemLabel="11 parcelas" />
							<f:selectItem itemValue="12" itemLabel="12 parcelas" />
						</h:selectOneMenu>
					</div>
				</div>
				<div class="grid_12">
					
				</div>
				<c:if
					test="${!empty reservaBusiness.reserva.codAerpIda and !empty reservaBusiness.reserva.codAerpVolta}">
					<div class="grid_12 vooDisp" id="divVoosDisp">
						<h:dataTable value="#{reservaBusiness.voosDisp}" id="voos"
							styleClass="tabela" rowClasses="odd,even" var="v">
							<h:column>
								<f:facet name="header">
									<h:outputText value="Vôo" />
								</f:facet>
								<h:outputText value="#{v.codigo}" />
							</h:column>
							<h:column>
								<f:facet name="header">
									<h:outputText value="Companhia" />
								</f:facet>
								<h:outputText value="#{v.companhia}" />
							</h:column>
							<h:column>
								<f:facet name="header">
									<h:outputText value="Data" />
								</f:facet>
								<h:outputText id="date" value="#{v.data}">
									<f:convertDateTime dateStyle="short" type="date"
										pattern="dd/MM/yyyy" />
								</h:outputText>
							</h:column>
							<h:column>
								<f:facet name="header">
									<h:outputText value="Origem" />
								</f:facet>
								<h:outputText value="#{v.origem}" />
							</h:column>
							<h:column>
								<f:facet name="header">
									<h:outputText value="Hora de saída" />
								</f:facet>
								<h:outputText value="#{v.horaSaida}" />
							</h:column>
							<h:column>
								<f:facet name="header">
									<h:outputText value="Destino" />
								</f:facet>
								<h:outputText value="#{v.destino}" />
							</h:column>
							<h:column>
								<f:facet name="header">
									<h:outputText value="Hora de chegada" />
								</f:facet>
								<h:outputText value="#{v.horaChegada}" />
							</h:column>
							<h:column>
								<f:facet name="header">
									<h:outputText value="Valor" />
								</f:facet>
								<h:outputText value="#{v.valor}" />
							</h:column>
							<h:column>
								<f:facet name="header">
									<h:outputText value="Opções" />
								</f:facet>
								<h:commandLink styleClass="reservar" value="reservar"
									action="#{reservaBusiness.reservar}" />
							</h:column>
						</h:dataTable>
					</div>
				</c:if>
			</div>
		</h:form>
	</div>
</body>
</html>